*{
	margin: 0;
	padding: 0;
}
html{
  font-size: 100px;
}
body{
  font-family:"PingFang SC","Lantinghei SC","Microsoft YaHei","HanHei SC","Helvetica Neue","Open Sans",Arial,"Hiragino Sans GB","微软雅黑",STHeiti,"WenQuanYi Micro Hei",SimSun,sans-serif;
}
ul,li{
  list-style: none;
}

.appnetwork{
    margin: 0 auto;
	width: 100%;
    overflow: hidden;
  .app__header{
    width: 100%;
    height: 9.03rem;
    margin-bottom: 0.89rem;
    background-attachment:fixed;
    background-size: 100% 9.03rem;
    background: url('../../assets/image/mhb.png') no-repeat;
    .header__title{
      width: 7.5rem;
      padding: 0.21rem 0 0 0.22rem;
      margin-bottom: 1.1rem;
      .header__logo{
        width: 2.44rem;
        height: 0.46rem;
        background: url('../../assets/image/mheadlogo.png');
        background-size: 2.44rem 0.46rem;
      }
    }
    .header__content{
      margin: 0 auto ;
      width: 6.23rem;
      position: relative;
      .content__top{
        width: 2.71rem;
        height: 1.36rem;
        margin: 0 auto;
        background: url('../../assets/image/mhctop.png');
        background-size: 2.71rem 1.36rem;
        -webkit-tap-highlight-color: transparent;
      }
      .content__title{
        position: absolute;
        left: 0;
        top: 1.92rem;
        width: 6.25rem;
        height: 1.30rem;
        margin: 0 auto 1.21rem;
        background: url('../../assets/image/mhctitle.png');
        background-size: 6.25rem 1.30rem;
      }
      .content__btn{
        position: absolute;
        top: 3.5rem;
        left: 1.4rem;
        width: 3.44rem;
        height: 1.07rem;
        background: url('../../assets/image/mhcontentbtn.png');
        background-size: 3.44rem 1.07rem;
        -webkit-tap-highlight-color: transparent;
      }
    }
  }
  .app__content{
    width: 100%;
    .content__start{
      margin: 0 auto 0.76rem;
      width: 5.85rem;
      height: 1.4rem;
      background: url('../../assets/image/mcstart.png') no-repeat;
      background-size: 5.85rem 1.4rem;
    }
    .content__service{
      width: 100%;
      span{
        display: inline-block;
        width: 100%;
        text-align: center;
        height:0.46rem;
        font-size:0.48rem;
        color:rgba(83,83,83,1);
        line-height:0.46rem;
      }
      h3{
        width: 1.24rem;
        height: 0.12rem;
        margin: 0 auto 0.36rem;
        background: url('../../assets/image/mctitleb.png') no-repeat;
        background-size: 1.24rem 0.12rem;
      }
      p{
        margin: 0 auto 0.94rem;
        width:7rem;
        height:2.23rem;
        font-size:0.28rem;
        text-align: center;
        color:rgba(136,136,136,1);
      }
      ul{
        width: 100%;
        li{
          width: 100%;
          display: -webkit-flex;
          display: flex;
          background-color: #00B8D3;
          height: 2.24rem;
          .li__logo{
            padding: 0.39rem 0.36px 0 0.58rem;
            h3{
              width: 0.86rem;
              height: 0.86rem;
              background: url('../../assets/image/mcsafe.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
          .description{
            flex: 1;
            -webkit-flex:1;
            padding-top: 0.33rem;
            padding-left: 0.35rem;
            .li__title{
              height:0.40rem;
              font-size:0.42rem;
              color:rgba(255,255,255,1);
              line-height:0.4rem;
              padding-bottom: 0.16rem;
            }
            p{
              margin-bottom: 0;
              text-align: left;
              height:0.89rem;
              font-size:0.26rem;
              color:rgba(255,255,255,1);
            }
          }
          &:nth-child(2){
            height: 1.55rem;
            background: #00A9D3;
            h3{
              background: url('../../assets/image/mccoordination.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
          &:nth-child(3){
            height: 1.55rem;
            background:#009AD3;
            h3{
              background: url('../../assets/image/mcschedule.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
          &:nth-child(4){
            height: 1.55rem;
            background:#0081D3;
            h3{
              background: url('../../assets/image/mcmaterial.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
          &:nth-child(5){
            height: 1.55rem;
            background:#006DD3;
            h3{
              background: url('../../assets/image/mcmanagess.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
          &:nth-child(6){
            height: 1.55rem;
            background:#0063D3;
            h3{
              background: url('../../assets/image/mcqz.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
          &:nth-child(7){
            padding-bottom: 0.32rem;
            height: 2.33rem;
            background:#004FD3;
            h3{
              background: url('../../assets/image/mclast.png') no-repeat;
              background-size: 0.85rem 0.85rem;
            }
          }
        }
      }
    }
    .content__assets,.content__partner,.content__video{
      text-align: center;
      span{
        display: inline-block;
        margin: 0 auto 0.19rem;
        height:0.46rem;
        font-size:0.48rem;
        color:rgba(83,83,83,1);
        line-height:0.46rem;
      }
      h3{
        width: 1.24rem;
        height: 0.12rem;
        margin: 0 auto 0.36rem;
        background: url('../../assets/image/mctitleb.png') no-repeat;
        background-size: 1.24rem 0.12rem;
      }
      p{
        margin: 0 auto 1.2rem;
        width:7rem;
        font-size:0.28rem;
        text-align: center;
        color:rgba(136,136,136,1);
      }
      div{
        margin: 0 auto;
        width: 6.63rem;
        height: 5.82rem;
        background: url('../../assets/image/mcassets.png') no-repeat;
        background-size: 6.63rem 5.82rem;
        &.partner{
          background: url('../../assets/image/mcpartner.png') no-repeat;
          background-size: 6.63rem 5.82rem;
        }
      }
      .video{
        width:100%;
        background: #fff;
        position:relative;
        padding-bottom:56.25%;
        height: 0.2rem;
        video{
          position: absolute;
          top:0;
          left: 0;
          width: 100%;
          height: 100%
        }
      }
    }
  }
  .app__footer{
    .footer__top{
      height:1.92rem;
      background:rgba(38,44,53,1);
      display: -webkit-flex;
      display: flex;
      .top__left{
        width: 1.21rem;
        padding: 0.56rem 0 0 0.41rem;
        h3{
          width: 0.80rem;
          height: 0.80rem;
          background: url('../../assets/image/mft.png') no-repeat;
          background-size: 0.80rem 0.80rem;
        }
      }
      .top__right{
        flex: 1;
        -webkit-flex:1;
        padding-top: 0.66rem;
        .right__top{
          font-size:0.26rem;
          color:rgba(255,255,255,1);
        }
        .right__bottom{
          font-size:0.3rem;
          color:rgba(22,208,255,1);
        }
      }
    }
    .footer__content{
      width: 100%;
      padding-bottom: 0.68rem;
      background-color: #181F29;

    .content{
      width: 100%;
      display: -webkit-flex;
      display: flex;
      padding-top: 0.53rem;
      padding-left: 0.51rem;
      div{
        width: 50%;
        display: -webkit-flex;
        display: flex;
        h3{
          width: 0.36rem;
          height: 0.46rem;
          background: url('../../assets/image/mfkeepsafe.png') no-repeat;
          background-size: 0.36rem 0.46rem;
          margin-right: 0.16rem;
          &.mfbz{
            width: 0.46rem;
            height: 0.46rem;
            background: url('../../assets/image/mfbz.png') no-repeat;
            background-size: 0.46rem 0.46rem;
          }
          &.mfzc{
            width: 0.46rem;
            background: url('../../assets/image/mfzc.png') no-repeat;
            background-size: 0.46rem 0.46rem;
          }
          &.mfyf{
            width: 0.45rem;
            background: url('../../assets/image/mfyf.png') no-repeat;
            background-size: 0.45rem 0.43rem;

          }
        }
        p{
          font-size:0.36rem;
          color:rgba(205,205,205,1);
        }
      }
    }
      .content__ewm{
        display: -webkit-flex;
        display: flex;
        padding-top: 0.95rem;
        .mfewm{
          margin-left: 1.01rem;
          margin-right: 0.51rem;
          width: 2.55rem;
          height: 2.57rem;
          background: url('../../assets/image/mfewm.png') no-repeat;
          background-size: 2.55rem 2.57rem;
        }
        .fonttoast{
          flex: 1;
          display: -webkit-flex;
          display: flex;
          flex-direction: column;
          padding-top: 1rem;
          p{
            font-size:0.26rem;
            color:rgba(158,158,158,1);
            margin-bottom: 0.1rem;
          }
        }
      }
    }
    .footer__bottom{
      height:2.33rem;
      background:rgba(11,17,27,1);
      text-align: center;
      font-size:0.24rem;
      color:rgba(101,113,130,1);
      padding-top: 0.79rem;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
    }
  }
}